<template>
	<view class="container">
		<uni-nav-bar class="ch-nav" height="96rpx" backgroundColor="#ffffff" leftWidth="90rpx" rightWidth="90rpx" color="#333" :fixed="true" :padding="false" :border="true" @clickLeft="$goBack(1)">
			<template slot="left">
				<image class="left" src="@/public/images/public/dhl_fhjt.png" mode="aspectFit"></image>
			</template>
			<text class="title">{{title}}</text>
			<template slot="right">
			</template>
		</uni-nav-bar>
		<web-view ref="webview" id="webview" class="webview" v-if="src" :src="src"></web-view>
	</view>
</template>


<script>
	export default {
		data() {
			return {
				name: null,
				src: null,
			}
		},
		computed: {
			title() {
				if(this.name == 'service'){
					return '彩虹体育服务条款'
				}
				if(this.name == 'recharge'){
					return '彩虹体育用户购买协议'
				}
				if(this.name == 'privacy'){
					return '彩虹体育隐私政策'
				}
				if(this.name == 'child'){
					return '儿童个人信息保护规则及监护人须知'
				}
				if(this.name == 'growth'){
					return '会员升级规则及升级福利'
				}
				if(this.name == 'subscribe'){
					return '专家优享订阅服务协议'
				}
				return '彩虹体育'
			}
		},
		onLoad(e) {
			if(this.$Route.query.name){
				this.name = this.$Route.query.name
			}
			if(this.$Route.query.src){
				this.src = this.$Route.query.src
			}else{
				this.src = '/static/html/'+ this.name +'.html'
			}
			window.addEventListener('message', this.handlerFunction, false);
		},
		onUnload() {
			window.removeEventListener('message', this.handlerFunction, false);
		},
		methods: {
			handlerFunction(event) {
				console.log(event.data)
				if(event.data.title){
					this.name = event.data.title
				}
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #FFFFFF;
	}
	.container{
		padding: 0;
	}
	.webview{
		margin-top: 96rpx;
		margin-bottom: var(--safe-area-inset-bottom);
	}
	.ch-nav{
		.title{
			font-size: 34rpx;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
	}
</style>
